<div>
	<yu-panel title="第三方驱动参数管理">
		<yu-row :gutter="24">
			<yu-col :span="5">
				<yu-xtree ref="refTree" :height="height - 20" @node-click="nodeClickFn" :data-url="treeDataUrl" data-id="appCode" data-label="appName"
				 data-pid="parentId" :data-async="async" :data-params="param" data-root="0000" style="margin:10px 10px 0 0;" icon="iconPath">
				</yu-xtree>
			</yu-col>
			<yu-col :span="19">
				<yu-xform related-table-name="refTable" form-type="search" v-model="searchFormdata">
					<yu-xform-group :column="4">
						<yu-xform-item label="驱动类型" placeholder="驱动类型" ctype="select" name="driverType" :options="driverTypes"></yu-xform-item>
						<yu-xform-item label="驱动缩写" placeholder="驱动缩写" ctype="input" name="classCode"></yu-xform-item>
						<yu-xform-item label="驱动名称" placeholder="驱动名称" ctype="input" name="className"></yu-xform-item>
					</yu-xform-group>
				</yu-xform>
				<yu-toolBar>
					<yu-button @click="addFn" v-if="nodeLeaf&&addFnButton">新增</yu-button>
					<yu-button @click="modifyFn" v-if="updateFnButton">修改</yu-button>
					<yu-button @click="deleteFn" v-if="deleteFnButton">删除</yu-button>
				</yu-toolBar>
				<div ref="tableBox" style="width: 100%;overflow: auto;">
					<yu-xtable :height="tbHeight" ref="refTable" row-number :data-url="dataUrl" selection-type="radio">
						<yu-xtable-column label="系统缩写" prop="appCode" sortable></yu-xtable-column>
						<yu-xtable-column label="系统名称" prop="appName" sortable></yu-xtable-column>
						<yu-xtable-column label="驱动简写" prop="classCode">
							<template slot-scope="scope">
								<a style="text-decoration:underline;color:#636CE4 " href="javascipt:void(0);" @click="viewFn(scope.row)" v-if="scope.row.classCode.trim() ===''">默认</a>
								<a style="text-decoration:underline;color:#636CE4" href="javascipt:void(0);" @click="viewFn(scope.row)" v-if="scope.row.classCode.trim() !==''">{{ scope.row.classCode}}</a>
							</template>
						</yu-xtable-column>
						<yu-xtable-column label="驱动名称" prop="className"></yu-xtable-column>
						<yu-xtable-column label="驱动类型" prop="driverType" :options="driverTypes"></yu-xtable-column>

					</yu-xtable>
				</div>
				<yu-xdialog :title="viewTitle" :visible.sync="dialogVisible" width="80%">
					<el-tabs type="border-card" v-model="activeTabName">
						<el-tab-pane label="驱动基本信息" name="basicInfo" :disabled="true">
							<yu-xform label-width="140px" ref="refForm" v-model="formdata" :disabled="formDisabled" label-width="120px">
								<yu-xform-group>
									<yu-xform-item label="系统代码" ctype="input" name="appCode" hidden></yu-xform-item>
									<yu-xform-item label="系统名称" ctype="input" name="appName" disabled></yu-xform-item>
									<yu-xform-item label="驱动类型" ctype="select" name="driverType" :options="driverTypes" :disabled="isReadOnly" rules="required"
									 @change="changeDriverType"></yu-xform-item>
									<yu-xform-item label="驱动缩写" ctype="input" name="classCode" :disabled="isReadOnly">
									</yu-xform-item>
									<yu-xform-item label="驱动名称" ctype="input" name="className" rules="required"></yu-xform-item>
									<yu-xform-item label="对应代理标识" ctype="select" name="agentId" rules="required" :options="agentIds"></yu-xform-item>
								</yu-xform-group>
							</yu-xform>

							<el-form ref="commonParamFormRef" label-width="100px">
								<el-form-item label="参数列表:" require="true">
									<yu-toolBar>
										<yu-button @click="propAddFn">新增</yu-button>
										<yu-button @click="propDeleteFN">删除</yu-button>
									</yu-toolBar>
									<yu-xtable ref="refPropTable" row-number selection-type="checkbox" :pageable="false" :data="propTableData" :max-height="250">
										<yu-xtable-column label="参数代码" prop="paramCode" ctype="input" :rules="rule[0]">
										</yu-xtable-column>
										<yu-xtable-column label="参数名称" prop="paramName" ctype="input" rules="required"></yu-xtable-column>
										<yu-xtable-column label="参数值" prop="paramValue" ctype="yufp-select-params" :params="nodeTemp" rules="required" @select-fn="getSelectedData"></yu-xtable-column>
									</yu-xtable>
								</el-form-item>
							</el-form>

							<div class="yu-grpButton">
								<yu-button v-show="cancelBtnShow" @click="cancelFn">取消</yu-button>
								<yu-button v-show="saveBtnShow" type="primary" @click="nextStep">下一步</yu-button>
							</div>
						</el-tab-pane>
						<el-tab-pane label="驱动详细" name="paramInfoInfo" :disabled="true">
							<div v-for=" item in  dynamicList" :key="item.key">
								<yu-xdynamic-form :ref="item.key" :template-data="item.dynamicObj" label-width="268px" v-if="currentDriverType === item.key "></yu-xdynamic-form>
							</div>
							<div class="yu-grpButton">
								<yu-button @click="lastStepFn">上一步</yu-button>
								<yu-button type="primary" v-if="!saveDisabled" @click="saveFn" :disabled="saveDisabled">保存</yu-button>
								<yu-button type="info" v-if="saveDisabled" @click="saveFn" :disabled="saveDisabled">保存</yu-button>
								<yu-button @click="cancelFn">关闭</yu-button>
							</div>
						</el-tab-pane>
					</el-tabs>
				</yu-xdialog>
			</yu-col>
		</yu-row>
	</yu-panel>
</div>